<!--  header结束-->
<div class="userPosition comWidth">
	<strong><a href="#">首页</a></strong>
	<span>&nbsp;&gt;&nbsp;</span>
	<a href="normal.html">标准图谱</a>
	<span>&nbsp;&gt;&nbsp;</span>
	<a href="normal-detail.html"><em>一元二次方程</em></a>
    <span>&nbsp;&gt;&nbsp;</span>
    <em>查看</em>
</div>

<div class="normalMap-show comWidth">
	<ul class="normalMap-show-item">                        
        </li><li><a href="<?php echo yii\helpers\Url::to(['normal/mapinfo'])?>">力矩图呈现</a></li>
	<li><a href="<?php echo yii\helpers\Url::to(['normal/mapinfo2'])?>" class="active" target="_self">树形图呈现</a></li>
	<li><a href="<?php echo yii\helpers\Url::to(['normal/mapinfo3'])?>" target="_self">地图层级呈现</a></li>
	</ul>
    
    <div class="normalMap-show-edit">
            <a href="#" target="#" class="course-go" data-gaevent=                              "course-go:v4.0.0.0:academy">
            <span class="icon-go"></span>自定义此图谱
            </a>
    </div>    
</div>

<!--图谱呈现开始 -->
 <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
    <div id="main" style="width:1200px; margin-left:auto; margin-right:auto;height:600px;margin-top:20px;border:#666 solid 1px;"></div>
    <!-- ECharts单文件引入 -->
    <script src="http://echarts.baidu.com/build/dist/echarts.js"></script>
    <script type="text/javascript">
        // 路径配置
        require.config({
            paths: {
                echarts: 'http://echarts.baidu.com/build/dist'
            }
        });
        
        // 使用
        require(
            [
                'echarts',
                'echarts/chart/treemap' // 使用柱状图就加载bar模块，按需加载
            ],
            function (ec) {
                // 基于准备好的dom，初始化echarts图表
                var myChart = ec.init(document.getElementById('main')); 
                
                var option = {
    title : {
        text: '知识点分布',
        subtext: '数据下钻例子，虚构数据',
		show:false,
    },
    tooltip : {
        trigger: 'item',
        formatter: "{b}: {c}"
    },
    toolbox: {
        show : false,
        feature : {
            mark : {show: true},
            dataView : {show: true, readOnly: false},
            restore : {show: true},
            saveAsImage : {show: true}
        }
    },
    calculable : false,
    series : [
        {
            name:'知识点分布',
            type:'treemap',
            itemStyle: {
                normal: {
                    label: {
                        show: true,
                        formatter: "{b}"
                    },
                    borderWidth: 1,
                    borderColor: '#ccc'
                },
                emphasis: {
                    label: {
                        show: true
                    },
                    color: '#cc99cc',
                    borderWidth: 3,
                    borderColor: '#996699'
                }
            },
            data:[
                {
                    name: '小学一年级',
                    itemStyle: {
                        normal: {
                            color: '#99cccc',
                        }
                    },
                    value: 6,
                    children: [
                        {
                            name: '数与计算',
                            value: 2
                        },
                        {
                            name: '统计',
                            value: 3
                        },
                        {
                            name: '画图',
                            value: 3
                        },
                        {
                            name: '钟表',
                            value: 1
                        }
                    ]
                },
                {
                    name: '小学二年级',
                    itemStyle: {
                        normal: {
                            color: '#99ccff',
                        }
                    },
                    value: 4,
                    children: [
                        {
                            name: '小米3',
                            value: 6
                        },
                        {
                            name: '小米4',
                            value: 6
                        },
                        {
                            name: '红米',
                            value: 4
                        }
                    ]
                },
                {
                    name: '小学三年级',
                    itemStyle: {
                        normal: {
                            color: '#9999cc',
                        }
                    },
                    value: 4,
                    children: [
                        {
                            name: 'iPhone 5s',
                            value: 6
                        },
                        {
                            name: 'iPhone 6',
                            value: 3
                        },
                        {
                            name: 'iPhone 6+',
                            value: 3
                        }
                    ]
                },
                {
                    name: '小学四年级',
                    itemStyle: {
                        normal: {
                            color: '#ccff99',
                        }
                    },
                    value: 1,
                    children: [
                        {
                            name: 'MX4',
                            itemStyle: {
                                normal: {
                                    color: '#ccccff',
                                }
                            },
                            value: 6
                        },
                        {
                            name: 'MX3',
                            itemStyle: {
                                normal: {
                                    color: '#99ccff',
                                }
                            },
                            value: 6
                        },
                        {
                            name: '魅蓝note',
                            itemStyle: {
                                normal: {
                                    color: '#9999cc',
                                }
                            },
                            value: 4
                        },
                        {
                            name: 'MX4 pro',
                            itemStyle: {
                                normal: {
                                    color: '#99cccc',
                                }
                            },
                            value: 3
                        }
                    ]
                },
                {
                    name: '小学五年级',
                    itemStyle: {
                        normal: {
                            color: '#ccffcc',
                        }
                    },
                    value: 2
                },
                {
                    name: '小学六年级',
                    itemStyle: {
                        normal: {
                            color: '#ccccff',
                        }
                    },
                    value: 2
                },
                {
                    name: '初中一年级',
                    itemStyle: {
                        normal: {
                            color: '#ffffcc',
                        }
                    },
                    value: 1,
                    children: [
                        {
                            name: 'V5',
                            value: 16
                        },
                        {
                            name: '努比亚',
                            value: 6
                        },
                        {
                            name: '功能机',
                            value: 4
                        },
                        {
                            name: '青漾',
                            value: 4
                        },
                        {
                            name: '星星',
                            value: 4
                        },
                        {
                            name: '儿童机',
                            value: 1
                        }
                    ]
                }
            ]
        }
    ]
};
                    
                    
                    
        
                // 为echarts对象加载数据 
                myChart.setOption(option); 
            }
        );
    </script>